<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      function getTiming() {
        try {
          var timing = performance.timing;
          var performanceTimingObj = {};

          var loadTime = (timing.loadEventEnd - timing.loadEventStart) / 1000;

          if (loadTime < 0) {
            setTimeout(function () {
              getTiming();
            }, 0);
            return;
          }

          performanceTimingObj["重定向时间"] =
            timing.redirectEnd - timing.redirectStart;
          performanceTimingObj["DNS 解析时间"] =
            timing.domainLookupEnd - timing.domainLookupStart;
          performanceTimingObj["TCP 完成握手时间"] =
            timing.connectEnd - timing.connectStart;
          performanceTimingObj["HTTP 请求响应完成时间"] =
            timing.responseEnd - timing.requestStart;
          performanceTimingObj["DOM 开始加载前所花费时间"] =
            timing.responseEnd - timing.navigationStart;
          performanceTimingObj["DOM 加载完成时间"] =
            (timing.domComplete || timing.domLoading) - timing.domLoading;
          performanceTimingObj["DOM 结构解析完成时间"] =
            timing.domInteractive - timing.domLoading;
          performanceTimingObj["开始跳转到服务器资源下载完成时间"] =
            timing.responseEnd - timing.navigationStart;
          performanceTimingObj["可交互的时间"] =
            timing.domContentLoadedEventEnd - timing.domContentLoadedEventStart;
          performanceTimingObj["首次呈现内容"] =
            timing.domLoading - timing.navigationStart;
          performanceTimingObj["onload 事件时间"] =
            timing.loadEventEnd - timing.loadEventStart;
          performanceTimingObj["页面完全加载时间"] =
            performanceTimingObj["重定向时间"] +
            performanceTimingObj["DNS 解析时间"] +
            performanceTimingObj["TCP 完成握手时间"] +
            performanceTimingObj["HTTP 请求响应完成时间"] +
            performanceTimingObj["DOM 结构解析完成时间"] +
            performanceTimingObj["DOM 加载完成时间"];

          for (item in performanceTimingObj) {
            console.log(item + ":" + performanceTimingObj[item] + "(ms)");
          }

          console.log(performance.timing);
        } catch (e) {
          console.log(performance.timing);
        }
      }

      function getEntries(){
          let pnt = []
          let
        performance.getEntries().forEach(item=>{
            console.log(item)
        })


      }


      window.onload = ()=>{
        getTiming()
        getEntries()
      };
    </script>
  </body>
</html>
